<template>
	<view class="page-content">
		<!-- <image class="img" src="@/static/cycdetail.png" mode="aspectFill"></image> -->
		<view class="content">
			<view class="rich-view">
				<!-- <image class="de-img" :src="obj.picture" mode="aspectFill"></image> -->
				<text class="title">{{obj.title}}</text>
				<view class="rich-content">
					<rich-text :nodes="obj.content"></rich-text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import http from '@/api/backend.js'
	export default {
		data() {
			return {
				obj: {},
				id: ""
			}
		},
		onLoad(option) {
			this.id = option.id
			this.getPetCyclopedia(option.id)
		},
		onPullDownRefresh() {
			this.getPetCyclopedia(this.id)
			uni.stopPullDownRefresh()
		},
		methods: {
			getPetCyclopedia(e) {
				const params = {id: parseInt(e)}
				http.getPetCyclopedia(params).then(res => {
					this.obj = res.data
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		padding: 40rpx 15rpx 0;
		//box-sizing: border-box;
		margin: 0 4%;
	}
	.page-content{
		height: 100%;
		width: 100%;
	}
	.rich-view .rich-content{
		padding-top: 30rpx;
	}
	.title{
		
		margin-top: 15rpx;
		height: 45rpx;
		border-left: 6rpx solid #F58418;
		padding-left: 20rpx;
		color: #F58418;
		font-size: 45rpx;
		
	}
</style>
